<template>
  <el-dialog title="人员信息查询" :close-on-click-modal="false" :visible.sync="visible" fullscreen center append-to-body>
    <el-button class="miui-dialog-close-btn" @click="visible = false">关闭页面</el-button>
    <el-card class="box-card" style="margin-bottom: 15px;">
      <div class="text item">
        <el-form :inline="true" ref="searchForm"  :model="dataForm" @keyup.enter.native="getDataList()">
          <el-form-item label="姓名" prop="name">
            <el-input v-model="dataForm.name" placeholder="姓名"></el-input>
          </el-form-item>
          <el-form-item label="联系方式" prop="telPhone">
            <el-input v-model="dataForm.telPhone" placeholder="联系方式"></el-input>
          </el-form-item>
          <el-form-item label="ID号" prop="uniqueCode">
            <el-input v-model="dataForm.uniqueCode" placeholder="ID号"></el-input>
          </el-form-item>
          <el-form-item label="证件号码" prop="certificateNum">
            <el-input v-model="dataForm.certificateNum" placeholder="证件号码"></el-input>
          </el-form-item>
          <el-form-item>
            <el-button type="primary" icon="el-icon-search" @click="getDataList">查询</el-button>
            <el-button type="default" icon="el-icon-delete" @click="clearSearchForm">清空</el-button>
          </el-form-item>
        </el-form>
      </div>
    </el-card>
    <el-table :data="dataList" height="calc(100vh - 215px)" ref="singleTable" border v-loading="dataListLoading">
      <el-table-column type="index" width="50">
        <template slot-scope="scope">
          <el-radio v-model="dataForm.customerId" :label="scope.row.id" style="position: relative;left: 6px;top:-2px;" @change="checkItem(scope.row)">&nbsp;</el-radio>
        </template>
      </el-table-column>
      <el-table-column prop="name" label="姓名"></el-table-column>
      <el-table-column prop="birthDay" label="出生年月"></el-table-column>
      <el-table-column prop="telPhone" label="联系方式"></el-table-column>
      <el-table-column prop="gender" label="客户性别">
        <template slot-scope="scope">
          <span v-if="scope.row.gender == '0'">男</span>
          <span v-if="scope.row.gender == '1'">女</span>
        </template>
      </el-table-column>
      <el-table-column prop="uniqueCode" label="ID号"></el-table-column>
    </el-table>
    <div class="avue-crud__pagination">
      <el-pagination
        @size-change="sizeChangeHandle"
        @current-change="currentChangeHandle"
        :current-page="pageIndex"
        :page-sizes="[10, 20, 50, 100]"
        :page-size="pageSize"
        :total="totalPage"
        background
        layout="total, sizes, prev, pager, next">
      </el-pagination>
    </div>
  </el-dialog>
</template>

<script>
  import {filterParams} from '@/util/tools'
  import {fetchCustomerList} from '@/api/eims/customer.js'
  import {fetchPersonList} from '@/api/pvm/person'
  export default {
    data () {
      return {
        visible: false,
        customerId: '',
        dataForm: {},
        dataList: [],
        dataListLoading: false,
        pageIndex: 1,
        pageSize: 100,
        totalPage: 0
      }
    },
    methods: {
      init () {
        this.visible = true
        this.dataForm.customerId = ''
        this.getDataList()
      },
			//	清空查询表单
			clearSearchForm() {
				for(let key in this.dataForm){
					this.dataForm[key] = ''
				}
			},
      getDataList() {
        let params1 = {current: this.pageIndex,size: this.pageSize}
        let params2 = filterParams(this.dataForm)
        fetchPersonList(Object.assign(params1,params2)).then(result => {
          this.dataList = result.data.data.records
          this.totalPage = result.data.data.total
        })
      },
      getCustomerList() {
        let params = {current: this.pageIndex,size: this.pageSize}
        fetchCustomerList(Object.assign(params1,params2)).then(result => {
            this.dataList = result.data.data.records
            this.totalPage = result.data.data.total
        })
      },
      // 每页数
      sizeChangeHandle (val) {
        this.pageSize = val
        this.pageIndex = 1
        this.getDataList()
      },
      // 当前页
      currentChangeHandle (val) {
        this.pageIndex = val
        this.getDataList()
      },
      // 选择投诉会员
      checkItem(val) {
        this.visible = false
        let data = {}
        for(let key in val){
          if(key == 'id'){
            data.customerId = val[key]
          }else{
            data[key] = val[key]
          }
        }
        this.$emit('refreshForm',data)
      },
    }
  }
</script>

<style>
</style>
